<template>
  <div class="editHouseDefault">
    <el-form ref="dataForm" :model="temp" label-width="100px" class="fromData">
      <el-form-item v-if="eee" label="ID:">
        <span>{{ temp.area_id }}</span>
      </el-form-item>
      <el-form-item label="期:">
        <el-input v-model="temp.area_court" style="width:300px;" />
      </el-form-item>
      <el-form-item label="幢号:">
        <el-input v-model="temp.area_building" style="width:300px;" />
      </el-form-item>
      <el-form-item label="单元:">
        <el-input v-model="temp.area_single" style="width:300px;" />
      </el-form-item>
      <el-form-item label="室:">
        <el-input v-model="temp.area_rooms" style="width:300px;" />
      </el-form-item>
      <el-form-item label="楼段系数:">
        <el-input v-model="temp.area_stairs" style="width:300px;" />
      </el-form-item>
      <el-form-item label="电梯编号:">
        <el-input v-model="temp.area_elevator" style="width:300px;" />
      </el-form-item>
      <el-form-item label="物业类型(住宅/办公):">
        <el-select v-model="temp.area_type" class="filter-item" placeholder="选择类型">
          <el-option v-for="item in houseType" :key="item" :label="item" :value="item" />
        </el-select>
      </el-form-item>
      <el-form-item label="房屋状态(已售/出租):">
        <el-select v-model="temp.area_state" class="filter-item" placeholder="选择状态">
          <el-option v-for="item in houseState" :key="item" :label="item" :value="item" />
        </el-select>
      </el-form-item>
      <el-form-item label="房屋面积:">
        <el-input v-model="temp.area_measure" style="width:300px;" />
      </el-form-item>
      <el-form-item label="收费面积:">
        <el-input v-model="temp.area_charge" style="width:300px;" />
      </el-form-item>
      <el-form-item label="物业费方案:">
        <el-input v-model="temp.area_programme" style="width:300px;" />
        <!-- <el-select v-model="temp.role_id" placeholder>
          <el-option
            v-for="item in options"
            :key="item.role_id"
            :label="item.role_name"
            :value="item.role_id"
          ></el-option>
        </el-select>-->
      </el-form-item>
      <el-form-item label="备注">
        <el-input v-model="temp.area_remarks" type="textarea" style="width:400px;" />
      </el-form-item>
      <el-form-item>
        <el-button v-if="aaa" type="primary" @click="creat">立即创建</el-button>
        <el-button v-if="bbb" type="primary" @click="update">立即更新</el-button>
        <el-button @click="goBack">取消</el-button>
      </el-form-item>
    </el-form>
    <el-button
      style="float:right;  position: absolute;
  top:40px;
  right:50px;"
      @click="goBack"
    >返回用户列表</el-button>
    <el-button
      v-if="zzz"
      type="primary"
      style="float:right;  position: absolute;
  top:100px;
  right:50px;"
      @click="cls"
    >新建一个</el-button>
    <!-- 确认执行 -->
    <el-dialog :visible.sync="submit" width="30%">
      <el-form
        ref="doForm"
        :rules="rules"
        :model="temp"
        label-position="left"
        label-width="70px"
        style="width: 400px; margin-left:50px;"
      >
        <span>确定执行此操作吗？</span>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="submit = false">取消</el-button>
        <el-button v-if="ccc" type="primary" @click="creatData">确定新增</el-button>
        <el-button v-if="ddd" type="primary" @click="updateData">确定更新</el-button>
      </div>
    </el-dialog>
  </div>
</template>
<script>
import request from '@/utils/request'
import { Message } from 'element-ui'
import { getToken, getAccount } from '@/utils/auth'
export default {
  data() {
    return {
      aaa: false, // 立即创建按钮
      bbb: true, // 立即更新按钮
      ccc: true, // 确定新增按钮
      ddd: false, // 确定更新按钮
      eee: false, // ID显示
      zzz: false, // 新增一个按钮
      houseType: ['住宅', '办公'],
      houseState: ['已售', '出租', '空置'],
      submit: false,
      rules: {},
      temp: {
        area_id: '',
        area_block: '',
        area_court: '',
        area_unit: '',
        area_rooms: '',
        area_building: '',
        area_elevator: '',
        area_type: '住宅',
        area_state: '已售',
        area_measure: '',
        area_charge: '',
        area_programme: '',
        area_remarks: ''
      }
    }
  },
  mounted() {
    var data = this.$route.params.data
    if (data !== undefined) {
      if (data.area_id === '') {
        this.aaa = true
        this.eee = false
        this.bbb = false
        this.zzz = false
      } else {
        this.temp = data
        this.eee = true
        this.aaa = false
        this.bbb = true
        this.zzz = true
      }
    } else {
      this.aaa = true
      this.eee = false
      this.bbb = false
      this.zzz = false
    }
    // 变量转换
    if (this.temp.area_type == '0') {
      this.temp.area_type = '住宅'
    } else {
      this.temp.area_type = '办公'
    }
    if (this.temp.area_state === '0') {
      this.temp.area_state = '已售'
    } else if (this.temp.area_state == '1') {
      this.temp.area_state = '出租'
    } else {
      this.temp.area_state = '空置'
    }
    this.getPaymath()
  },
  methods: {
    // 获取所有物业费方案
    getPaymath() {
      return request({
        url: '/v3/rule/list',
        method: 'post',
        headers: {
          account_type: getAccount()
        },
        data: {
          current_page: 1,
          page_size: 10,
          rule_id: 0
        }
      }).then(res => {
        console.log(res)
      })
    },
    // 清除数据，添加一个
    cls() {
      this.$router.go(0) // 刷新页面
    },
    // 新增
    creat() {
      this.submit = true
      this.ccc = true
      this.ddd = false
    },
    // 修改
    update() {
      this.submit = true
      this.ccc = false
      this.ddd = true
    },
    // 返回
    goBack() {
      this.$router.push({ path: '/archives/houseDefault' })
    },
    // 确认新增
    creatData() {
      if (this.temp.area_type === '住宅') {
        this.temp.area_type = 0
      } else if (this.temp.area_type === '办公') {
        this.temp.area_type = 1
      }
      if (this.temp.area_state === '已售') {
        this.temp.area_state = 0
      } else if (this.temp.area_state === '出租') {
        this.temp.area_state = 1
      } else {
        this.temp.area_state = 2
      }
      // this.$refs["dataForm"].validate(valid => {
      //   if (valid) {
      //     return request({
      //       url: "/v3/admin/area/insert",
      //       method: "post",
      //       headers: {
      //         account_type: getAccount()
      //       },
      //       data: this.temp
      //     }).then(res => {
      //       if (res.tip === "添加成功.") {
      //         this.submit = false;
      //         this.$router.push({ path: "/archives/houseDefault" });
      //         return res;
      //       } else {
      //         Message({
      //           message: "添加失败，检查信息",
      //           type: "error",
      //           duration: 2 * 1000
      //         });
      //       }
      //     });
      //   } else {
      //     Message({
      //       message: "添加失败，检查信息",
      //       type: "error",
      //       duration: 2 * 1000
      //     });
      //   }
      // });
    },
    // 确认修改
    updateData() {
      if (this.temp.area_type === '住宅') {
        this.temp.area_type = 0
      } else if (this.temp.area_type === '办公') {
        this.temp.area_type = 1
      }
      if (this.temp.area_state === '已售') {
        this.temp.area_state = 0
      } else if (this.temp.area_state === '出租') {
        this.temp.area_state = 1
      } else {
        this.temp.area_state = 2
      }
      // this.$refs["dataForm"].validate(valid => {
      //   if (valid) {
      //     return request({
      //       url: "/v3/admin/area/update",
      //       method: "post",
      //       headers: {
      //         account_type: getAccount()
      //       },
      //       data: this.temp
      //     }).then(res => {
      //       if (res.tip === "编辑成功.") {
      //         this.submit = false;
      //         this.$router.push({ path: "/archives/houseDefault" });
      //         return res;
      //       }
      //     });
      //   } else {
      //     Message({
      //       message: "提交失败，检查信息",
      //       type: "error",
      //       duration: 2 * 1000
      //     });
      //   }
      // });
    }
  }
}
</script>
<style lang="scss" scoped>
.editHouseDefault {
  margin-top: 50px;
  padding: 20px;
  position: relative;
  overflow: hidden;
  .fromData {
    padding-left: 100px;
  }
}
</style>
